import React from 'react';
import styled from 'styled-components';
import { GameProvider } from './context/GameContext';
import Game from './components/Game';

const AppContainer = styled.div`
  display: flex;
  flex-direction: column;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
  padding: 20px;
`;

const Title = styled.h1`
  color: #1a1a1a;
  margin-bottom: 20px;
  text-align: center;
  font-size: 2.5rem;
`;

const App: React.FC = () => {
  return (
    <GameProvider>
      <AppContainer>
        <Title>🐍 Love Snake Game 💕</Title>
        <Game />
      </AppContainer>
    </GameProvider>
  );
};

export default App; 